import React from "react";
import styles from "../../../css/attendance.module.css";
import flex_styles from "../../../css/flex.module.css";
import { locationTo } from "../../../utils/LocationUtil";
import * as locations from '../../../const/locations'
import { Debt, Common, Attend } from "../../../const/imgs"
class ApplyScreen extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      selectedIndex: 0
    };
  }
  navigate = (e) => {
    this.setState({
      selectedIndex: e
    })
  }
  render() {
    return (
      <div>
        <div className={styles['attend_container']}>
          <div className={styles['stat_item_w']}
            onClick={() => {
              locationTo(locations.APPLY)
            }}
          >
            <div className={styles['stat_item_key']}>
              <img src={Attend.SQJL} alt='' style={{ width: '16px', marginRight: '5px' }} />
              申请记录
          </div>
            <div className={styles['stat_item_value']}>
              <img src={Debt.YJT} style={{ width: '8px' }} alt='' />
            </div>
          </div>
        </div>
        <div className={styles['attend_container']}>
          <div className={styles['attend_container_in']}> 
            <ApplyItem title='补卡申请' imgurl={Attend.BUKA} path={locations.RECARD} />
            <ApplyItem title='请假申请' imgurl={Attend.QJSQ} path={locations.LEAVE} />
          </div>
        </div>
      </div>
    );
  }
}

const ApplyItem = ({imgurl,title,path}) => {
  return (
    <div className={styles['apply_flex']}>
      <div className={styles['apply_flex_in']}
        onClick={() => {
          locationTo(path)
        }}
      >
        <div>
          <div className={flex_styles.flex_center}>
            <img src={imgurl} style={{ width: '32px', height: '32px', marginBottom: '8px' }} alt='' />
          </div>

          <div style={{ textAlign: 'center', whiteSpace: 'nowrap' }}>
            {title}
                </div>
        </div>
      </div>
    </div>
  )
}

export default ApplyScreen;
